<form (submit)="onSubmit($event)">
  <div>
    <label>
      Email:
      <input type="email" [field]="loginForm.email" />
    </label>

    @if (loginForm.email().touched() && loginForm.email().invalid()) {
      <ul class="error-list">
        @for (error of loginForm.email().errors(); track error) {
          <li>{{ error.message }}</li>
        }
      </ul>
    }
  </div>

  <div>
    <label>
      Password:
      <input type="password" [field]="loginForm.password" />
    </label>

    @if (loginForm.password().touched() && loginForm.password().invalid()) {
      <ul class="error-list">
        @for (error of loginForm.password().errors(); track error) {
          <li>{{ error.message }}</li>
        }
      </ul>
    }
  </div>

  <button type="submit" [disabled]="loginForm().invalid()">Log In</button>
</form>
